import { React, useEffect, useRef } from "react";
import { useDispatch } from "react-redux";
import { HIDE_TABBER, SHOW_TABBER } from "../../store/action-type/tabber";
import { useHistory } from "react-router-dom";
import { NavBar, Space, Checkbox, SearchBar } from "antd-mobile";
import "../../MIUIcss/Findtype/Selectphone.scss";

function Selectphone() {
  const dispatch = useDispatch();
  useEffect(() => {
    dispatch({ type: HIDE_TABBER });
  }, []);
  const { go } = useHistory();
  const { replace, push } = useHistory();
  const back = () => {
    go(-1);
    dispatch({ type: SHOW_TABBER });
  };
  return (
    <div className="Selectphone">
      <div className="Selectphone-nav">
        <NavBar onBack={back}>
          <span>我命中注定的手机</span>
        </NavBar>
      </div>
      <div className="sele-process">
        <ul>
          <h3>官人,您买手机有指定预算吗?</h3>
          <li>
            <Checkbox />
            <img src="../../../src/image/Find/tiaoxuan1.png" alt="" />
            <p>1000元以下</p>
          </li>
          <li>
            <Checkbox />
            <img src="../../../src/image/Find/tiaoxuan2.png" alt="" />
            <p>1000-2000元</p>
          </li>
          <li>
            <Checkbox />
            <img src="../../../src/image/Find/tiaoxuan3.png" alt="" />
            <p>2000以上</p>
          </li>
        </ul>
      </div>
    </div>
  );
}

export default Selectphone;
